<template lang="html">
    <section class="content">
        <swiper :options="options" :not-next-tick="options.notNextTick">
            <swiper-slide v-for="item in items" :key="item.href">
                {{item.text}}
                <em>></em>
            </swiper-slide>
        </swiper>
    </section>
</template>

<script>
import Slider from "../core/slider.vue"
import { swiper, swiperSlide } from "vue-awesome-swiper"
export default {
    components: {
        Slider,
        swiper,
        swiperSlide,
    },
    data() {
        return {
            items: [
              {text:"签到领流量，1元500M！"},{text:"百万白条券免费送，速来领取！！ "}
            ],
            options: {
                autoplay: true,
                loop: true,
                direction: "vertical",
            },
        }
    },
}
</script>

<style lang="scss" scoped>
.content {
    margin-top: 120px;
    padding-left: 178px;
    height: 72px;
    line-height: 72px;
    overflow: hidden;
    background: #fff url('//m.jr.jd.com/spe/qyy/main/images/scroll_title_img.png') left top no-repeat;
    background-size: 144px 72px;
    .swiper-container-vertical{
      height: 72px;
      .swiper-slide{
        height: 72px;
        font-size: 28px;
        color:#333;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        em{
          color:#ddd;
          float: right;
          margin-right: 10px;
        }
      }
    }
}
</style>
